import React from "react";
import Logo from "./logo";
import {logUserOut} from "../../backend/auth";
import Link from '../router/Link';


function Navigation({ user }) {
  return (
      <div className="navbar">
        <Logo />
        {user.authenticated ? (
            <span className="user-nav-widget">
              <span>{user.name}</span>
              <img width={40} className="img-circle" src={`${user.profilePicture.indexOf('http') === -1
                  ? `${process.env.REACT_APP_SERVE}${user.profilePicture}`
                  : user.profilePicture
              }`} alt='' />
              <span onClick={() => logUserOut()}>
                <i className="fa fa-sign-out" />
              </span>
            </span>
        ) : (
            <Link to="/login">
              <button type="button">登陆或注册</button>
            </Link>
        )}
      </div>
  )
}

export default Navigation;
